<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<HTML xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<!--text area, with a confirmation dialog pops -->
<script type="text/javascript" src="wp-content/plugins/scope/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({
        // General options
        mode : "textareas",	
        theme : "advanced",

        plugins : "autolink,lists,spellchecker,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template",

        // Theme options
        theme_advanced_buttons1 : "bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,formatselect,fontselect,fontsizeselect",
        theme_advanced_buttons2 : "code,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,cite,|,insertdate,inserttime,preview,print",
        theme_advanced_buttons3 : "tablecontrols,|,sub,sup,|,charmap|,fullscreen,help",
        
        theme_advanced_toolbar_location : "top",
        theme_advanced_toolbar_align : "left",
        theme_advanced_statusbar_location : "bottom",
        theme_advanced_resizing : false,
	
	inline_styles : false,
        // Skin options
        skin : "wp_theme"

        // Drop lists for link/image/media/template dialogs
       // template_external_list_url : "js/template_list.js",
       // external_link_list_url : "js/link_list.js",
        //external_image_list_url : "js/image_list.js",
        //media_external_list_url : "js/media_list.js",

});
</script>

<HEAD>
<TITLE>Problems</TITLE>
</HEAD>
<BODY>
<div id="forms-wrapper">
<FORM name="theForm" action="wp-content/plugins/scope/get_submission.php"

                                                onsubmit= "return true" method=post>
        <div>
                                <label for="name">Name:</label>
                                                <input type="text" size="40" name="name" 
                                                value="" />
                                </div>
                                <div>
                                                <label for="email">Email:</label>
                                                <input type="text" size="40" name="email" 
                                                value=""/>
                                </div>
                                
                                <div>
                                                <label for="subject">Problem Title:</label>
                                                <input type="text" size=40" name="subject"  value="" />
                                </div>
        
                                <label for="subject">Enter Problem:</label>
                                                <textarea name="comments" id="comments"></textarea>
                                   <div>
                                                <label for="url">Problem Source URL (if applicable, optional):</label>
                                                <input type="text" size=40" name="url"  value="" />
                                </div>
<input type="button" onclick="preview()"  value="Submit" />
<input type="reset"  value="Reset" />      
                                </div>
</FORM>
</BODY>
<SCRIPT language="JavaScript"> 
function preview()
{
                //get the value from the form
                var title=document.theForm.subject.value;
                var author=document.theForm.name.value;
                var email=document.theForm.email.value;
                var comments=tinyMCE.get('comments').getContent();
                var url=document.theForm.url.value;    
                //centered windows
                var width  = 600;
                var height = 600;
                var left   = (screen.width  - width)/2;
               var top    = (screen.height - height)/2;
                var params = 'width='+width+', height='+height;
                params += ', top='+top+', left='+left;
                var generator=window.open('','Preview', params);
                

                //output the value 
                generator.document.write("<head>");
                generator.document.write("<style>");
                generator.document.write("body,input,textarea,button{font-size:12px;word-break:break-all;}");
                generator.document.write(".title {font-size:16px;font-weight:bold;}");
                generator.document.write("table{border:1px solid #666666;background-color:#cccccc;");            
                generator.document.write("td.news{line-height:120%;font-size:14px;text-indent:2em;word-break:break-all;}");
                generator.document.write("</style>");
                generator.document.write("</head>");
                generator.document.write("<body>");
                generator.document.write("<form name=\"form1\" action=\"wp-content/plugins/scope/get_submission.php\"  method=post>");
                generator.document.write('<input type=\"hidden\" size=\"40\" name=\"subject\"  value="'+ title +'" />');
                generator.document.write('<textarea  style="visibility:hidden; display:none;" name= "comments"   rows= "8"   cols= "50 ">'+comments+'</textarea>');
                generator.document.write('<input type=\"hidden\" size=\"40\" name=\"name\"  value="'+ author +'" />');
                generator.document.write('<input type=\"hidden\" size=\"40\" name=\"email\"  value="'+ email +'" />');
                generator.document.write('<input type=\"hidden\" size=\"40\" name=\"url\"  value="'+ url +'" />');

                generator.document.write("<table width='500' border='0' cellspacing='1' cellpadding='4' align='center'>");

                
                generator.document.write("<tr><td class='title' align='center'>"+title+"<hr></td></tr>");
                generator.document.write("<tr><td align='left'>Author："+author+"</td></tr>");
                generator.document.write("<tr><td class='news'>Problem:</td></tr>");
                generator.document.write("<tr><td class='news'>"+comments+"</td></tr>");
                if(url != "")
                {
                generator.document.write('<tr><td>URL:<a href="http://' + url + '" target=_blank">' + url + '</a></td></tr>');
                }
                generator.document.write("</table>");
                generator.document.write("<p align='center'><button id = 'submit' onclick='window.opener.theForm.submit(); window.close();'>confirm</button>");
                generator.document.write("<button type = 'reset' onclick='self.close();'>back</button>");
                generator.document.write("</form>");
                generator.document.write("</body>");
    return
}
function problemform(event) 
{ 
var retVal = confirm("Are you sure your want to submit this problem?, Click OK to proceed otherwise click Cancel");
   if( retVal == true )
{
      alert("Thank you for participating!");
          return true;
}else
{
      alert("Have a Nice Day!");
          return false;
   }
}
</SCRIPT>
<style type="text/css">
body {
                font-family:Arial, Tahoma, sans-serif;
}
#forms-wrapper {
                width:625px;
                border:1px solid #e2e2e2;
                background:#E8E8E8 ;
                padding:20px;
}
#forms-wrapper div {
                clear:both;
                margin:1em 0;
}
#forms-wrapper label {
                display:block;
                float:none;
                font-size:16px;
                width:auto;
}
</style>
</HTML>
